<template>
    <div>
        <echartsList
            :x_data="x_data"
            ref="myEcharts"
            :seriesList="seriesList"
            :name="name"
        ></echartsList>

        <div class="tableTab tab_box_fiance">
            <span
                class="tableBtn"
                :class="{ on: index == timeIdx }"
                @click="onTime(item, key, index)"
                v-for="(item, key, index) in timeType"
                :key="index"
                >{{ item }}</span
            >
        </div>

        <!-- 资产负债表 非银行金融-->
        <div class="table w1021 flex" v-if="isBank == 'nonbank'">
            <div class="tableTh tableTr flex wrap w220 right">
                <span class="tableTd">资产负债表(万元)</span>
                <span
                    :class="{ active_Row: activeRow == key }"
                    @click="handSelect(key, item.itemInfo)"
                    v-for="(item, key, index) in nonbankData"
                    class="tableTd top"
                >
                    {{ item.title }}
                </span>
            </div>
            <div class="tableTr tableBody flex">
                <div
                    class="flex wrap w130"
                    v-for="(item, index) in datalist"
                    :key="index"
                >
                    <span class="tableTd">{{ item.enddate | dateFrom }}</span>
                    <span
                        :class="{ active_Row: activeRow == 1 }"
                        @click="handSelect(1, 'fb110101')"
                        class="orange tableTd top"
                        >{{ item.fb110101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 2 }"
                        @click="handSelect(2, 'fb110115')"
                        class="orange tableTd top"
                        >{{ item.fb110115 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 3 }"
                        @click="handSelect(3, 'fb110601')"
                        class="orange tableTd top"
                        >{{ item.fb110601 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 4 }"
                        @click="handSelect(4, 'fb111101')"
                        class="orange tableTd top"
                        >{{ item.fb111101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 5 }"
                        @click="handSelect(5, 'fb111201')"
                        class="orange tableTd top"
                        >{{ item.fb111201 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 6 }"
                        @click="handSelect(6, 'fb111401')"
                        class="orange tableTd top"
                        >{{ item.fb111401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 7 }"
                        @click="handSelect(7, 'fb111501')"
                        class="orange tableTd top"
                        >{{ item.fb111501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 8 }"
                        @click="handSelect(8, 'fb114001')"
                        class="orange tableTd top"
                        >{{ item.fb114001 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 9 }"
                        @click="handSelect(9, 'fb111301')"
                        class="orange tableTd top"
                        >{{ item.fb111301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 10 }"
                        @click="handSelect(10, 'fb121601')"
                        class="orange tableTd top"
                        >{{ item.fb121601 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 11 }"
                        @click="handSelect(11, 'fb121701')"
                        class="orange tableTd top"
                        >{{ item.fb121701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 12 }"
                        @click="handSelect(12, 'fb121017')"
                        class="orange tableTd top"
                        >{{ item.fb121017 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 13 }"
                        @click="handSelect(13, 'fb122337')"
                        class="orange tableTd top"
                        >{{ item.fb122337 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 14 }"
                        @click="handSelect(14, 'fb122727')"
                        class="orange tableTd top"
                        >{{ item.fb122727 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 15 }"
                        @click="handSelect(15, 'fb1236601')"
                        class="orange tableTd top"
                        >{{ item.fb1236601 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 16 }"
                        @click="handSelect(16, 'fb121801')"
                        class="orange tableTd top"
                        >{{ item.fb121801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 17 }"
                        @click="handSelect(17, 'fb130000')"
                        class="orange tableTd top"
                        >{{ item.fb130000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 18 }"
                        @click="handSelect(18, 'fb100000')"
                        class="orange tableTd top"
                        >{{ item.fb100000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 19 }"
                        @click="handSelect(19, 'fb210201')"
                        class="orange tableTd top"
                        >{{ item.fb210201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 20 }"
                        @click="handSelect(20, 'fb210301')"
                        class="orange tableTd top"
                        >{{ item.fb210301 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 21 }"
                        @click="handSelect(21, 'fb210501')"
                        class="orange tableTd top"
                        >{{ item.fb210501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 22 }"
                        @click="handSelect(22, 'fb210601')"
                        class="orange tableTd top"
                        >{{ item.fb210601 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 23 }"
                        @click="handSelect(23, 'fb210701')"
                        class="orange tableTd top"
                        >{{ item.fb210701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 24 }"
                        @click="handSelect(24, 'fb212301')"
                        class="orange tableTd top"
                        >{{ item.fb212301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 25 }"
                        @click="handSelect(25, 'fb212401')"
                        class="orange tableTd top"
                        >{{ item.fb212401 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 26 }"
                        @click="handSelect(26, 'fb213101')"
                        class="orange tableTd top"
                        >{{ item.fb213101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 27 }"
                        @click="handSelect(27, 'fb213601')"
                        class="orange tableTd top"
                        >{{ item.fb213601 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 28 }"
                        @click="handSelect(28, 'fb213801')"
                        class="orange tableTd top"
                        >{{ item.fb213801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 29 }"
                        @click="handSelect(29, 'fb211801')"
                        class="orange tableTd top"
                        >{{ item.fb211801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 30 }"
                        @click="handSelect(30, 'fb221301')"
                        class="orange tableTd top"
                        >{{ item.fb221301 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 31 }"
                        @click="handSelect(31, 'fb230101')"
                        class="orange tableTd top"
                        >{{ item.fb230101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 32 }"
                        @click="handSelect(32, 'fb214201')"
                        class="orange tableTd top"
                        >{{ item.fb214201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 33 }"
                        @click="handSelect(33, 'fb250101')"
                        class="orange tableTd top"
                        >{{ item.fb250101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 34 }"
                        @click="handSelect(34, 'fb200000')"
                        class="orange tableTd top"
                        >{{ item.fb200000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 35 }"
                        @click="handSelect(35, 'fb300201')"
                        class="orange tableTd top"
                        >{{ item.fb300201 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 36 }"
                        @click="handSelect(36, 'fb300301')"
                        class="orange tableTd top"
                        >{{ item.fb300301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 37 }"
                        @click="handSelect(37, 'fb300313')"
                        class="orange tableTd top"
                        >{{ item.fb300313 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 38 }"
                        @click="handSelect(38, 'fb300401')"
                        class="orange tableTd top"
                        >{{ item.fb300401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 39 }"
                        @click="handSelect(39, 'fb300701')"
                        class="orange tableTd top"
                        >{{ item.fb300701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 40 }"
                        @click="handSelect(40, 'fb300601')"
                        class="orange tableTd top"
                        >{{ item.fb300601 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 41 }"
                        @click="handSelect(41, 'fb300901')"
                        class="orange tableTd top"
                        >{{ item.fb300901 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 42 }"
                        @click="handSelect(42, 'fb300101')"
                        class="orange tableTd top"
                        >{{ item.fb300101 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 43 }"
                        @click="handSelect(43, 'fb301301')"
                        class="orange tableTd top"
                        >{{ item.fb301301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 44 }"
                        @click="handSelect(44, 'fb300000')"
                        class="orange tableTd top"
                        >{{ item.fb300000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 45 }"
                        @click="handSelect(45, 'fb400000')"
                        class="orange tableTd top"
                        >{{ item.fb400000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 46 }"
                        @click="handSelect(46, 'fb122801')"
                        class="orange tableTd top"
                        >{{ item.fb122801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 47 }"
                        @click="handSelect(47, 'fb210401')"
                        class="orange tableTd top"
                        >{{ item.fb210401 | filterVal("number") }}</span
                    >
                </div>
            </div>
        </div>
        <!-- 资产负债表 非银行金融-->

        <!-- 资产负债表 非金融-->
        <div class="table w1021 flex" v-show="isBank == 'gen'">
            <div class="tableTh tableTr flex wrap w220 right">
                <span class="tableTd">资产负债表(百万元)</span>
                <span
                    :class="{ active_Row: activeRow == key }"
                    @click="handSelect(key, item.itemInfo)"
                    v-for="(item, key, index) in genData"
                    class="tableTd top"
                >
                    {{ item.title }}
                </span>
            </div>
            <div class="tableTr tableBody flex">
                <div
                    class="flex wrap w130"
                    v-for="(item, index) in datalist"
                    :key="index"
                >
                    <span class="tableTd">{{ item.enddate | dateFrom }}</span>
                    <span
                        :class="{ active_Row: activeRow == 1 }"
                        @click="handSelect(1, 'b110101')"
                        class="orange tableTd top"
                        >{{ item.b110101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 2 }"
                        @click="handSelect(2, 'b110701')"
                        class="orange tableTd top"
                        >{{ item.b110701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 3 }"
                        @click="handSelect(3, 'b110801')"
                        class="orange tableTd top"
                        >{{ item.b110801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 4 }"
                        @click="handSelect(4, 'b110901')"
                        class="orange tableTd top"
                        >{{ item.b110901 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 5 }"
                        @click="handSelect(5, 'b111501')"
                        class="orange tableTd top"
                        >{{ item.b111501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 6 }"
                        @click="handSelect(6, 'b110001')"
                        class="orange tableTd top"
                        >{{ item.b110001 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 7 }"
                        @click="handSelect(7, 'b120301')"
                        class="orange tableTd top"
                        >{{ item.b120301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 8 }"
                        @click="handSelect(8, 'b130122')"
                        class="orange tableTd top"
                        >{{ item.b130122 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 9 }"
                        @click="handSelect(9, 'b130101')"
                        class="orange tableTd top"
                        >{{ item.b130101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 10 }"
                        @click="handSelect(10, 'b140101')"
                        class="orange tableTd top"
                        >{{ item.b140101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 11 }"
                        @click="handSelect(11, 'b140401')"
                        class="orange tableTd top"
                        >{{ item.b140401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 12 }"
                        @click="handSelect(12, 'b120801')"
                        class="orange tableTd top"
                        >{{ item.b120801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 13 }"
                        @click="handSelect(13, 'b160000')"
                        class="orange tableTd top"
                        >{{ item.b160000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 14 }"
                        @click="handSelect(14, 'b100000')"
                        class="orange tableTd top"
                        >{{ item.b100000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 15 }"
                        @click="handSelect(15, 'b210301')"
                        class="orange tableTd top"
                        >{{ item.b210301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 16 }"
                        @click="handSelect(16, 'b210401')"
                        class="orange tableTd top"
                        >{{ item.b210401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 17 }"
                        @click="handSelect(17, 'b111522')"
                        class="orange tableTd top"
                        >{{ item.b111522 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 18 }"
                        @click="handSelect(18, 'b210001')"
                        class="orange tableTd top"
                        >{{ item.b210001 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 19 }"
                        @click="handSelect(19, 'b220001')"
                        class="orange tableTd top"
                        >{{ item.b220001 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 20 }"
                        @click="handSelect(20, 'b270001')"
                        class="orange tableTd top"
                        >{{ item.b270001 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 21 }"
                        @click="handSelect(21, 'b200000')"
                        class="orange tableTd top"
                        >{{ item.b200000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 22 }"
                        @click="handSelect(22, 'b310101')"
                        class="orange tableTd top"
                        >{{ item.b310101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 23 }"
                        @click="handSelect(23, 'b310201')"
                        class="orange tableTd top"
                        >{{ item.b310201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 24 }"
                        @click="handSelect(24, 'b310301')"
                        class="orange tableTd top"
                        >{{ item.b310301 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 25 }"
                        @click="handSelect(25, 'b300000')"
                        class="orange tableTd top"
                        >{{ item.b300000 | filterVal("number") }}</span
                    >
                </div>
            </div>
        </div>
        <!-- 资产负债表 非金融-->

        <!-- 资产负债表 银行-->
        <div class="table w1021 flex" v-if="isBank == 'bank'">
            <div class="tableTh tableTr flex wrap w220 right">
                <span class="tableTd">资产负债表(万元)</span>
                <span
                    :class="{ active_Row: activeRow == key }"
                    @click="handSelect(key, item.itemInfo)"
                    v-for="(item, key, index) in bankData"
                    class="tableTd top"
                >
                    {{ item.title }}
                </span>
            </div>
            <div class="tableTr tableBody flex">
                <div
                    class="flex wrap w130"
                    v-for="(item, index) in datalist"
                    :key="index"
                >
                    <span class="tableTd">{{ item.enddate | dateFrom }}</span>
                    <span
                        :class="{ active_Row: activeRow == 1 }"
                        @click="handSelect(1, 'bb110101')"
                        class="orange tableTd top"
                        >{{ item.bb110101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 2 }"
                        @click="handSelect(2, 'bb110901')"
                        class="orange tableTd top"
                        >{{ item.bb110901 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 3 }"
                        @click="handSelect(3, 'bb110401')"
                        class="orange tableTd top"
                        >{{ item.bb110401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 4 }"
                        @click="handSelect(4, 'bb110501')"
                        class="orange tableTd top"
                        >{{ item.bb110501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 5 }"
                        @click="handSelect(5, 'bb110701')"
                        class="orange tableTd top"
                        >{{ item.bb110701 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 6 }"
                        @click="handSelect(6, 'bb110801')"
                        class="orange tableTd top"
                        >{{ item.bb110801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 7 }"
                        @click="handSelect(7, 'bb111701')"
                        class="orange tableTd top"
                        >{{ item.bb111701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 8 }"
                        @click="handSelect(8, 'bb121501')"
                        class="orange tableTd top"
                        >{{ item.bb121501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 9 }"
                        @click="handSelect(9, 'bb121601')"
                        class="orange tableTd top"
                        >{{ item.bb121601 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 10 }"
                        @click="handSelect(10, 'bb121701')"
                        class="orange tableTd top"
                        >{{ item.bb121701 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 11 }"
                        @click="handSelect(11, 'bb121117')"
                        class="orange tableTd top"
                        >{{ item.bb121117 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 12 }"
                        @click="handSelect(12, 'bb122347')"
                        class="orange tableTd top"
                        >{{ item.bb122347 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 13 }"
                        @click="handSelect(13, 'bb122827')"
                        class="orange tableTd top"
                        >{{ item.bb122827 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 14 }"
                        @click="handSelect(14, 'bb123701')"
                        class="orange tableTd top"
                        >{{ item.bb123701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 15 }"
                        @click="handSelect(15, 'bb121901')"
                        class="orange tableTd top"
                        >{{ item.bb121901 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 16 }"
                        @click="handSelect(16, 'bb130000')"
                        class="orange tableTd top"
                        >{{ item.bb130000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 17 }"
                        @click="handSelect(17, 'bb100000')"
                        class="orange tableTd top"
                        >{{ item.bb100000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 18 }"
                        @click="handSelect(18, 'bb210101')"
                        class="orange tableTd top"
                        >{{ item.bb210101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 19 }"
                        @click="handSelect(19, 'bb211201')"
                        class="orange tableTd top"
                        >{{ item.bb211201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 20 }"
                        @click="handSelect(20, 'bb210301')"
                        class="orange tableTd top"
                        >{{ item.bb210301 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 21 }"
                        @click="handSelect(21, 'bb210501')"
                        class="orange tableTd top"
                        >{{ item.bb210501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 22 }"
                        @click="handSelect(22, 'bb210601')"
                        class="orange tableTd top"
                        >{{ item.bb210601 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 23 }"
                        @click="handSelect(23, 'bb210701')"
                        class="orange tableTd top"
                        >{{ item.bb210701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 24 }"
                        @click="handSelect(24, 'bb211401')"
                        class="orange tableTd top"
                        >{{ item.bb211401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 25 }"
                        @click="handSelect(25, 'bb213101')"
                        class="orange tableTd top"
                        >{{ item.bb213101 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 26 }"
                        @click="handSelect(26, 'bb213201')"
                        class="orange tableTd top"
                        >{{ item.bb213201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 27 }"
                        @click="handSelect(27, 'bb213401')"
                        class="orange tableTd top"
                        >{{ item.bb213401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 28 }"
                        @click="handSelect(28, 'bb211901')"
                        class="orange tableTd top"
                        >{{ item.bb211901 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 29 }"
                        @click="handSelect(29, 'bb214501')"
                        class="orange tableTd top"
                        >{{ item.bb214501 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 30 }"
                        @click="handSelect(30, 'bb220801')"
                        class="orange tableTd top"
                        >{{ item.bb220801 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 31 }"
                        @click="handSelect(31, 'bb230101')"
                        class="orange tableTd top"
                        >{{ item.bb230101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 32 }"
                        @click="handSelect(32, 'bb213801')"
                        class="orange tableTd top"
                        >{{ item.bb213801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 33 }"
                        @click="handSelect(33, 'bb240101')"
                        class="orange tableTd top"
                        >{{ item.bb240101 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 34 }"
                        @click="handSelect(34, 'bb310201')"
                        class="orange tableTd top"
                        >{{ item.bb310201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 35 }"
                        @click="handSelect(35, 'bb310301')"
                        class="orange tableTd top"
                        >{{ item.bb310301 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 36 }"
                        @click="handSelect(36, 'bb310703')"
                        class="orange tableTd top"
                        >{{ item.bb310703 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 37 }"
                        @click="handSelect(37, 'bb310401')"
                        class="orange tableTd top"
                        >{{ item.bb310401 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 38 }"
                        @click="handSelect(38, 'bb310701')"
                        class="orange tableTd top"
                        >{{ item.bb310701 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 39 }"
                        @click="handSelect(39, 'bb310801')"
                        class="orange tableTd top"
                        >{{ item.bb310801 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 40 }"
                        @click="handSelect(40, 'bb310101')"
                        class="orange tableTd top"
                        >{{ item.bb310101 | filterVal("number") }}</span
                    >

                    <span
                        :class="{ active_Row: activeRow == 41 }"
                        @click="handSelect(41, 'bb311201')"
                        class="orange tableTd top"
                        >{{ item.bb311201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 42 }"
                        @click="handSelect(42, 'bb300000')"
                        class="orange tableTd top"
                        >{{ item.bb300000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 43 }"
                        @click="handSelect(43, 'bb400000')"
                        class="orange tableTd top"
                        >{{ item.bb400000 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 44 }"
                        @click="handSelect(44, 'bb110201')"
                        class="orange tableTd top"
                        >{{ item.bb110201 | filterVal("number") }}</span
                    >
                    <span
                        :class="{ active_Row: activeRow == 45 }"
                        @click="handSelect(45, 'bb200000')"
                        class="orange tableTd top"
                        >{{ item.bb200000 | filterVal("number") }}</span
                    >
                </div>
            </div>
        </div>
        <!-- 资产负债表 银行-->
    </div>
</template>
<script>
const href = window.location.href;
const stock = href.match(/stock=(\w+)/);
import echartsList from "./echartsList";
import { numberNo, number, finList, changeNumber } from "../../script/api";
import { bankData, genData, nonbankData } from "./data_tab_8";
export default {
    components: {
        echartsList,
    },
    filters: {
        dateFrom(val) {
            return val.substring(0, 10);
        },
        filterVal(ops, num) {
            if (num == "numberNo") {
                return numberNo(ops, num);
            }
            if (num == "number") {
                return number(ops, num, 1000000);
            }
            if (num == "num") {
                return number(ops, num, 10000);
            }
            if (num == "numb") {
                return number(ops, num, 100);
            }
            if (num == "yiyuan") {
                return number(ops, num, 100000000);
            }
            return ops ? ops : "0.00";
        },
    },
    data() {
        return {
            name: "",
            activeRow: 1,
            x_data: [],
            seriesList: [],
            datalist: [],
            isBank: "", // gen: 非金融,bank:金融,nonbank:非银行金融
            timeIdx: 0, //时间区间 report-报告期，year-年报
            timeType: { report: "按报告期", year: "按年度" },
            tabList: [
                {
                    finished: false,
                    list: [],
                },
                {
                    finished: false,
                    list: [],
                },
                {
                    finished: false,
                    list: [],
                },
            ],
            genData: genData,
            nonbankData: nonbankData,
            bankData: bankData,
        };
    },
    mounted() {
        this.init();
    },
    methods: {
        init() {
            let stockCode = stock[1] || "";
            let timeInx = this.timeIdx || 0;
            let interval = Object.keys(this.timeType)[timeInx];
            if (stockCode.length > 6) {
                stockCode = stockCode.substring(2);
            } else {
                stockCode = stockCode;
            }
            finList({ stockCode, type: "bala", interval }).then((res) => {
                this.tabList[timeInx].list = res.data;
                this.datalist = [...this.tabList[this.timeIdx].list];
                this.isBank = res.stockType;
                this.namechange();
                this.handleXData();
            });
        },
        onTime(item, key, index) {
            this.timeIdx = index;
            this.init();
            this.activeRow = 1;
        },
        namechange() {
            if (this.isBank == "gen") {
                this.name = this.genData[this.activeRow]["title"]+"（百万元）";
            }
            if (this.isBank == "nonbank") {
                this.name = this.nonbankData[this.activeRow]["title"]+"（百万元）";
            }
            if (this.isBank == "bank") {
                this.name = this.bankData[this.activeRow]["title"]+"（百万元）";
            }
        },
        handleXData() {
            this.x_data = [];
            this.seriesList = [];
            this.datalist.map((item) => {
                this.x_data.push(item.enddate.substring(0, 10));
                let y_data = 0;
                let key = null;
                if (this.isBank == "gen") {
                    //第一行数据
                    key = this.genData[this.activeRow].itemInfo;
                    y_data = changeNumber(item[key], 1000000);
                } else if (this.isBank == "nonbank") {
                    key = this.nonbankData[this.activeRow].itemInfo;
                    y_data = changeNumber(item[key], 10000);
                } else if (this.isBank == "bank") {
                    key = this.bankData[this.activeRow].itemInfo;
                    y_data = changeNumber(item[key], 10000);
                }

                // y_data = number(item[key], "number", 1000000);
                this.seriesList.push(y_data);
            });
            console.log("x_data", this.x_data);
            console.log("seriesList", this.seriesList);
        },
        handSelect(selectRow, key) {
            this.seriesList = [];
            this.activeRow = selectRow;
            this.namechange();
            this.datalist.map((item) => {
                let y_data = 0;
                if (item[key]) {
                    if (this.isBank == "bank") {
                        y_data = changeNumber(item[key], 10000);
                    } else if (this.isBank == "nonbank") {
                        y_data = changeNumber(item[key], 10000);
                    } else if (this.isBank == "gen") {
                        y_data = changeNumber(item[key], 1000000);
                    }
                }
                this.seriesList.push(y_data);
            });

            console.log("this.seriesList", this.seriesList);
        },
    },
};
</script>